<template>
	<div id="register" class="login_bg">
		<common-login :commonData="{$parent:$parent}"></common-login>
		<div class="login_box">
			<ul class="text_center login_box_ul register_box_ul">
				<li><router-link class="login_tab_active" to="/register">个人重置密码</router-link></li>
				<li><router-link to="/company_forget">企业重置密码</router-link></li>
			</ul>
			<form class="login_form" ref="form" :model="form" @keyup.enter="toForgetPwd(form)">
				<div class="login_input_box">
					<img class="login_icon" src="../../static/img/login/login_user.png">
					<input type="text" v-model.trim="form.telephone" placeholder="请输入手机号">
				</div>
				<div class="login_input_box login_input_code">
					<img class="login_icon" src="../../static/img/login/login_code.png">
					<input type="text" v-model.trim="form.code" placeholder="请输入验证码">
					<input class="register_getcode" readonly="readonly" :value="verifyCode" :disabled="disabled" @click="getVerifyCode" />
				</div>
				<div class="login_input_box">
					<img class="login_icon" src="../../static/img/login/login_pwd.png">
					<input type="password" v-model.trim="form.newPwd" placeholder="请输入您的密码">
				</div>
				<div class="login_input_box">
					<img class="login_icon" src="../../static/img/login/login_rePwd.png">
					<input type="password" v-model.trim="form.reNewPwd" placeholder="请再次确认您的密码">
				</div>
                <p style="color: #FF0000;margin-top: 20px;">注：点击”重置密码“后页面自动刷新即为重置成功!</p>
				<div class="login_btn_box text_center">
					<a class="login_btn" @click="toForgetPwd(form)">重置密码</a>
					<router-link class="login_a" to="/login">点击登录</router-link>
				</div>
			</form>
		</div>
	</div>
</template>

<script>
	import commonLogin from '../components/c_login.vue'
	export default {
		name: 'forget_pwd',
		data() {
			return {
				verifyCode: "获取短信验证码",
				disabled: false,
				form: {
					telephone: "",
					newPwd: "",
					reNewPwd: "",
                    v_token:"",
					code: ""
				}
			}
		},
		created: function() {

		},
		mounted: function() {},
		methods: {
			getVerifyCode: function() {
				var that = this;
				var telephone = this.form.telephone;
				if (telephone == "") {
					this.$message.error('请输入手机号！');
					return;
				}
				this.common.post(this.api.getVerifyCodeForget, {
					telephone: telephone
				}, function(data) {
                    that.form.v_token=data.resultMap;
					that.setInter();
				}, function(error) {
					that.$message.error(error.resultMsg);
				});

			},
			setInter: function() {
				var that = this;
				var countDown = 60;
				var timer = setInterval(function() {
					countDown--;
					that.verifyCode = "短信已发送（" + countDown + "）";
					that.disabled = true;
					if (countDown < 1) {
						clearInterval(timer);
						that.verifyCode = "获取短信验证码";
						that.disabled = false;
					}
				}, 1000);
			},
			toForgetPwd: function(dataForm) {
				// console.log(JSON.stringify(dataForm));
				var that = this;
				if (dataForm.telephone == "") {
					this.$message.error('请输入手机号！');
					return;
				}
				if (dataForm.code == "") {
					this.$message.error('请输入验证码！');
					return;
				}
				if (dataForm.newPwd == "") {
					this.$message.error('请输入密码！');
					return;
				}
				if (dataForm.reNewPwd == "") {
					this.$message.error('请再次输入密码！');
					return;
				}
				if (dataForm.newPwd != dataForm.reNewPwd) {
					this.$message.error('两次密码输入不一致！');
					return;
				}
				this.common.post(this.api.resetPwd, dataForm, function(data) {
					that.$message.success("密码重置成功！");
                   setTimeout(function(){
                        that.common.toPage("/login");
                   },1500);
				}, function(error) {
					that.$message.error(error.resultMsg);
				});
			}
		},
		components: {
			"common-login": commonLogin
		}
	}
</script>
<style>
	@import url("../assets/css/login.css");
</style>
